export function didMount() {
    const textElm = this.state.modelCache.get('text_2rgr73');
    const defaultData = {
        imgUrl: 'https://via.placeholder.com/80', // 默认占位图
        stallName: '当前摊位名称',
        timeTag: '早摊',
        location: '曙光路摊点',
        city: '湛江市',
        area: '4',
        type: '瓜果类'
    };

    const data = (window.POINT_LAYER_DATA && Object.keys(window.POINT_LAYER_DATA).length)
        ? window.POINT_LAYER_DATA
        : defaultData;

    setTimeout(() => {
        if (textElm && data) {
            let template = `
        <div style="display: flex; gap: 12px; align-items: flex-start;">
          <!-- 左侧图片 -->
          <img src="${data.imgUrl}" style="width: 80px; height: 80px; border-radius: 8px; object-fit: cover;" />

          <!-- 右侧内容 -->
          <div style="flex: 1;">
            
            <!-- 第一行：标题 + 绿色标签 -->
            <div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px;">
              <div style="font-size: 16px; font-weight: 550; color: #223355;">${data.stallName}</div>
              <div style="font-size: 12px; color: #fff; background: #21B97A; padding: 2px 6px; border-radius: 4px;">${data.timeTag}</div>
            </div>

            <!-- 灰色说明 -->
            <div style="color: #A8B4C8; font-size: 12px; line-height: 18px;">
              <div>所属摊点 ${data.location}</div>
              <div>所属区域 ${data.city}</div>
              <div>摊位面积 ${data.area}㎡</div>
              <div>摊位类别 ${data.type}</div>
            </div>

            <!-- 按钮 -->
            <div style="margin-top: 8px;">
              <button style="background: #1E90FF; color: #fff; font-size: 14px; padding: 6px 16px; border: none; border-radius: 20px; cursor: pointer;">
                预约摊位
              </button>
            </div>
          </div>
        </div>
      `;
            textElm.props.defaultValue.value = template;
        }
    }, 100);
}
